<template>
	<view class="order">
		<!-- 列表 -->
		<view class="listBox">
			<view class="list" v-for="(item,index) in list" :key="index">
				<view class="list_t">
					<view class="name">VIP·{{item.level_details.name}}</view>
					<view class="time">
						{{item.createtime_text}}
					</view>
				</view>
				<view class="list_b">
					<view class="time">￥{{item.level_details.price}}</view>
				</view>
			</view>

		</view>

		<!-- 提示栏 -->
		<view class="isText">{{isText}}</view>
	</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [],
				isText: '',
			};
		},
		onLoad() {

		},
		onShow() {
			this.list = []
			this.isText = ''
			this.getList()
		},
		methods: {
			// 购买记录列表
			async getList() {
				let that = this
				await uni.request({
					url: '/wanlshop/user/levelPayLog',
					success: res => {
						res.data.length == 0 ? that.isText = '暂无数据' : that.isText = ''
						that.list = res.data
					}
				});
			},

		},
	}
</script>

<style lang="less">
	page {
		background-color: #f9f9f9;
	}

	.order {
		width: 100vw;

		.isText {
			width: 100%;
			text-align: center;
			font-size: 28rpx;
			margin-top: 30rpx;
		}

		.listBox {
			width: 95%;
			margin: 30rpx auto;

			.list {
				width: 100%;
				height: auto;
				padding: 20rpx;
				border-radius: 20rpx;
				background-color: #fff;
				margin: 20rpx auto;

				.list_t {
					width: 100%;
					display: flex;
					font-size: 28rpx;
					font-weight: 400;
					justify-content: space-between;
					align-items: center;
					padding-bottom: 10rpx;
					border-bottom: 2rpx solid #eae9e9;

					.name {
						height: 50rpx;
						line-height: 50rpx;
					}

					.time {
						font-size: 26rpx;
						color: #BABABA;
					}
				}

				.list_b {
					width: 100%;
					font-size: 28rpx;
					display: flex;
					margin-top: 16rpx;

					.time {
						color: #F06E56;
						margin-right: 16rpx;
					}
				}
			}
		}
	}
</style>